<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>H+ 客户应收欠款</title>
    <link rel="shortcut icon" href="../content/static/img/favicon.ico">
    <link href="../content/css/common_modal.css" rel="stylesheet">
    <link href="../content/static/css/font-awesome.min.css?v=4.4.0" rel="stylesheet">
    <link href="../content/js/lib/vue/select2.min.css" rel="stylesheet">
    <link href="../content/static/css/bootstrap.min.css?v=3.3.5" rel="stylesheet">
    <link href="../content/static/css/plugins/iCheck/custom.css" rel="stylesheet">
    <link href="../content/static/css/plugins/chosen/chosen.css" rel="stylesheet">
    <link href="../content/js/lib/calendar/calendar.css" rel="stylesheet">
    <link href="../content/js/lib/calendar/scrollbar.css" rel="stylesheet">
    <link href="../content/static/css/style.min.css?v=4.0.0" rel="stylesheet">
    <style>
        .fa-female:before {
            color: #fb7cd5;
        }
        .fa-location-arrow:before {
            color: rebeccapurple;
        }
        .fa-mobile-phone:before, .fa-mobile:before{
            color: black;
        }
        .fa-map-marker:before {
            color: #1ab394;
        }
        table-th{
            font-size: 12px;
            font-family: tahoma, "Microsoft YaHei", "Hiragino Sans GB", Arial, sans-serif;
            line-height: 1.42857143;
            color: #333;
            background-color: #f5f5f5;
        }
        table tr{ height:40px;}
        #productTree {
            width: 320px;
            max-height: 376px;
            min-height: 32px;
            overflow-y: auto;
            padding: 10px 10px 0;
        }
        .projectTreeWrap {
            top:148px !important
        }
        .checkbox label, .radio label{
            padding-left: 15px;
        }.search{
            float: left;padding: 0px 10px 0px 0px;
        } 
       .tooltip-inner{
        max-width: 650px;
        text-align: left;
       }
    </style>
</head>

<body class="content-container">
    <div class="wrapper wrapper-content animated fadeInRight">
        <div class="row">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <ol class="breadcrumb">
                        <li><a>财务管理</a></li>
                        <li><a>客户应收欠款列表</a></li>
                    </ol>
                </div>
                <div class="content-wrapper">
                    <div class="search-condition">
                        <div>
                            <div class="filter-wrapper">
                                <ul class="clearfix">
                                    <li class="filter-item ">
                                        <label>客户名称</label>
                                        <div>
                                            <div class="fill-wrapper">
                                                <input id="serialNumber" type="text" class="fill-item">
                                            </div>
                                        </div>
                                    </li>
                                    <li class="filter-item ">
                                        <label>客户编号</label>
                                        <div>
                                            <div class="fill-wrapper">
                                                <input id="serialNumber" type="text" class="fill-item">
                                            </div>
                                        </div>
                                    </li>
                                    <li class="filter-item ">
                                        <label>联系电话</label>
                                        <div>
                                            <div class="fill-wrapper">
                                                <input id="serialNumber" type="text" class="fill-item">
                                            </div>
                                        </div>
                                    </li>

                                    <li class="filter-item ">
                                        <label>客户等级</label>
                                        <div>
                                            <select v-select2 id="warehouse">
                                                <option value='0'>全部</option>
                                                <option v-for="item in warehouseList" v-bind:value="item.Value"
                                                    v-bind:selected="$index===0" v-text="item.Text"></option>
                                            </select>
                                        </div>
                                    </li>
                                    <li class="filter-item">
                                        <a class="revision-btn revision-btn-search">搜索</a>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="col-sm-12" style="padding: 12px 0px 12px 0px;">
                        <div class="alert alert-info" style="margin-bottom: 0px">
                            <a class="revision-btn" v-on:click="addShow()">新增</a>
                            <a class="revision-btn" v-on:click="exportShow()">导出</a>&nbsp;&nbsp;
                            <span>总条数：<span>12 条</span></span>&nbsp;&nbsp;&nbsp;
                            <span>应收总欠款：<span>120,00.00</span></span>
                        </div>
                    </div>
                    <table class="table table-hover table-bordered">
                        <thead style="background: #f5f5f5;">
                            <tr>
                                <th>
                                    <input class="revision-checkbox" type="checkbox" v-model="item.checked">
                                </th>
                                <th>姓名</th>
                                <th>
                                    <div class="tooltip-demo">编号
                                        <label class="fa fa-info-circle" data-toggle="tooltip" data-placement="bottom"
                                            title="" data-original-title="该客户的唯一编码"></label>
                                    </div>
                                </th>
                                <th>性别</th>
                                <th>年龄</th>
                                <th>应收欠款</th>
                                <th>电话</th>
                                <th>客户级别</th>
                                <th>关联业务员</th>
                                <th>
                                    <div class="tooltip-demo">状态
                                        <label class="fa fa-info-circle" data-toggle="tooltip" data-placement="bottom"
                                            title="" data-original-title="禁用后，该客户无法在销售单或进货单录入时选择"></label>
                                    </div>
                                </th>
                                <th style="width: 120px;">操作</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td><input class="revision-checkbox" type="checkbox" v-model="item.checked">
                                </td>
                                <td>张三</td>
                                <td><a href="" data-toggle="modal" v-on:click="detailShow">CUS2019010115300230</a></td>
                                <td class="text-navy">男</td>
                                <td>23</td>
                                <td class="amount" style="color: #F00;">200.00</td>
                                <td>15150444723</td>
                                <td>普通客户</td>
                                <td>-</td>
                                <td class="text-navy">启用</td>
                                <td>
                                    <a href="" class="">编辑</a>
                                    <a href="" class="">删除</a>
                                    <a href="">新增销售</a>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <input class="revision-checkbox" type="checkbox" v-model="item.checked">
                                </td>
                                <td>李四</td>
                                <td><a href="" data-toggle="modal" data-target="#edit">CUS2019010115300192</a></td>
                                <td class="text-navy">男</td>
                                <td>27</td>
                                <td class="amount" style="color: #F00;">800.00</td>
                                <td>15150444723</td>
                                <td>普通客户</td>
                                <td>-</td>
                                <td class="text-navy">启用</td>
                                <td>
                                    <a href="" class="">编辑</a>
                                    <a href="" class="">删除</a>
                                    <a href="">新增销售</a>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <input class="revision-checkbox" type="checkbox" v-model="item.checked">
                                </td>
                                <td>王麻子</td>
                                <td><a href="" data-toggle="modal" data-target="#edit">CUS2019010115300119</a></td>
                                <td class="text-warning">女</td>
                                <td>65</td>
                                <td class="amount" style="color: #F00;">56409.00</td>
                                <td>15150444723</td>
                                <td>普通客户</td>
                                <td>张晓敏</td>
                                <td class="text-navy">启用</td>
                                <td>
                                    <a href="">编辑</a>
                                    <a href="">删除</a>
                                    <a href="">新增销售</a>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <input class="revision-checkbox" type="checkbox" v-model="item.checked">
                                </td>
                                <td>李文明</td>
                                <td><a href="" data-toggle="modal" data-target="#edit">CUS2019010115300089</a></td>
                                <td class="text-warning">女</td>
                                <td>65</td>
                                <td class="amount" style="color: #F00;">569.00</td>
                                <td>15150444723</td>
                                <td>普通客户</td>
                                <td>范筱</td>
                                <td class="text-navy">启用</td>
                                <td>
                                    <a href="">编辑</a>
                                    <a href="">删除</a>
                                    <a href="">新增销售</a>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <input class="revision-checkbox" type="checkbox" v-model="item.checked">
                                </td>
                                <td>赵武</td>
                                <td><a href="" data-toggle="modal" data-target="#edit">CUS2019010115300029</a></td>
                                <td class="text-warning">女</td>
                                <td>65</td>
                                <td class="amount" style="color: #F00;">56.00</td>
                                <td>15150444723</td>
                                <td>普通客户</td>
                                <td>张震岳</td>
                                <td class="text-danger">禁用</td>
                                <td>
                                    <a href="">编辑</a>
                                    <a href="">删除</a>
                                    <a href="">新增销售</a>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
            <div style="display: none;" v-show="pageInit">
                <!-- 新增/修改客户 -->
                <modal v-bind:show.sync="addModal.show" v-bind:style="addModal .style" v-bind:add-class="addModal.addClass">
                    <h4 slot="header">新增客户
                        <span class="title-tips">创建日期：<span>2018-12-20 14:40:58</span></span>
                        <span class="title-tips">创建人：<span>当前登陆人</span></span>
                    </h4>
                    <div slot="body" class="clearfix">
                        <form class="form-horizontal m-t" novalidate="novalidate">
                            <h3 class="panel-title">基本信息</h3>
                            <div class="form-group" style="margin-top: 15px">
                                <label class="col-sm-2 control-label">客户编号</label>
                                <div class="col-sm-4">
                                    <input name="lastname" class="form-control" type="text" readonly>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">客户姓名</label>
                                <div class="col-sm-4">
                                    <input name="firstname" class="form-control" type="text" value="xxx软件有限公司">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">性别</label>
                                <div class="col-sm-4">
                                    <div class="radio i-checks">
                                        <label><input type="radio" value="option1" name="a"> <i></i> 男</label>
                                        <label><input type="radio" checked="" value="option2" name="a"> <i></i> 女</label>
                                    </div>
                                </div>
                                <input class="revision-checkbox" type="checkbox" style="margin-left: 40px" v-on:click="checkSame($event)">设为默认用户
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">联系人</label>
                                <div class="col-sm-4">
                                    <input name="lastname" class="form-control" type="text" value="王莉">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">联系电话</label>
                                <div class="col-sm-4">
                                    <input name="lastname" class="form-control" type="text" value="15888055634">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">客户类型</label>
                                <div class="col-sm-4">
                                    <select v-select2 id="customer_type">
                                        <option v-for="item in typeList" v-bind:value="item.Value" v-bind:selected="$index===0"
                                            v-text="item.Text"></option>
                                    </select>
                                </div>
                                <label class="col-sm-2 control-label">客户状态</label>
                                <div class="col-sm-4">
                                    <select v-select2 id="customer_status">
                                        <option value="-1">-</option>
                                        <option value="0">启用</option>
                                        <option value="1">禁用</option>
                                    </select>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">期初欠款</label>
                                <div class="col-sm-4">
                                    <input name="lastname" class="form-control amount" type="text" value="800,0.00">
                                </div>
                                <label class="col-sm-2 control-label">客户等级</label>
                                <div class="col-sm-4">
                                    <select v-select2 id="customer_level">
                                        <option v-for="item in customerList" v-bind:value="item.Value" v-bind:selected="$index===0"
                                            v-text="item.Text"></option>
                                    </select>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">联系地址</label>
                                <div class="col-sm-9">
                                    <textarea id="ccomment" name="comment" class="form-control" style="height: 65px;"></textarea>
                                </div>
                            </div>
                            <div>
                                <h3 class="panel-title">附属信息</h3>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">业务员</label>
                                <div class="col-sm-3">
                                    <select id="supplier">
                                        <option v-for="item in warehouseList" v-bind:value="item.Value" v-bind:selected="$index===0"
                                            v-text="item.Text"></option>
                                    </select>
                                </div>
                                <label class="col-sm-2 control-label">微信号</label>
                                <div class="col-sm-3">
                                    <input class="form-control" type="text">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">邮箱</label>
                                <div class="col-sm-3">
                                    <input class="form-control" type="text">
                                </div>
                                <label class="col-sm-2 control-label">邮编</label>
                                <div class="col-sm-3">
                                    <input class="form-control" type="text">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">QQ</label>
                                <div class="col-sm-3">
                                    <input class="form-control" type="text">
                                </div>
                                <label class="col-sm-2 control-label">传真</label>
                                <div class="col-sm-3">
                                    <input class="form-control" type="text">
                                </div>
                            </div>
                            <div v-show="flag">
                                <div class="form-group" >
                                    <label class="col-sm-2 control-label">单位电话</label>
                                    <div class="col-sm-3">
                                        <input class="form-control" type="text">
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">所在单位</label>
                                    <div class="col-sm-9">
                                        <textarea id="ccomment" name="comment" class="form-control"></textarea>
                                    </div>
                                </div>
                            </div>
                            <div>
                                <h3 class="panel-title">其他信息</h3>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-1 control-label">备注</label>
                                <div class="col-sm-10">
                                    <textarea id="ccomment" name="comment" class="form-control" style="height: 65px;"></textarea>
                                </div>
                            </div>
                            <div class="form-group" style="margin-top: 40px;">
                                <a style="margin-left: 252px;" class="revision-btn" href="javascript:;" v-on:click="selectProduct()">保存</a>
                            </div>
                        </form>
                    </div>
                </modal>
                <!-- 客户详情 -->
                <modal v-bind:show.sync="detailModal.show" v-bind:style="detailModal .style" v-bind:add-class="detailModal.addClass">
                    <h4 slot="header">详情</h4>
                    <div slot="body" class="clearfix">
                        <div class="approve-detail-modal-title">
                            <h2>客户详情</h2>
                        </div>
                        <ul class="bill-tips clearfix">
                            <li>
                                <em>客户编号</em>
                                <span>CUS20181220005</span>
                            </li>
                            <li>
                                <em>创建时间</em>
                                <span>2018-12-22</span>
                            </li>
                            <li>
                                <em>创建人</em>
                                <span>王老板</span>
                            </li>
                            <li>
                                <em>客户来源</em>
                                <span>xxx业务员</span>
                            </li>
                            <li>
                                <em>用户状态</em>
                                <span class="amount">禁用</span>/ <span class="text-navy">禁用</span>
                            </li>
                            <li class="w-100">
                                <em>备注</em>
                                <span>湖东老赖</span>
                            </li>
                        </ul>
                        <div>
                            <h3 class="panel-title">基本信息 </h3>
                        </div>
                        <ul class="bill-tips clearfix">
                            <li>
                                <em>客户姓名</em>
                                <span>2018-12-22</span>
                            </li>
                            <li>
                                <em>性别</em>
                                <span>男</span>
                            </li>
                            <li>
                                <em>客户等级</em>
                                <span>金牌</span>
                            </li>
                            <li>
                                <em>联系人</em>
                                <span>方老板小蜜</span>
                            </li>
                            <li>
                                <em>联系电话</em>
                                <span>1888888888</span>
                            </li>
                            <li>
                                <em>期初欠款</em>
                                <span class="amount">800,0.00</span>
                            </li>
                            <li class="w-100">
                                <em>联系地址</em>
                                <span>盈云软件网络科技股份有限公司120台按摩器</span>
                            </li>
                        </ul>
                        <div>
                            <h3 class="panel-title">附属信息</h3>
                        </div>
                        <ul class="bill-tips clearfix">
                            <li>
                                <em>单位电话</em>
                                <span>0512-88888888</span>
                            </li>
                            <li>
                                <em>传真</em>
                                <span>0512-88888888</span>
                            </li>
                            <li>
                                <em>邮编</em>
                                <span>025123</span>
                            </li>
                            <li>
                                <em>邮箱</em>
                                <span>409104540@qq.com</span>
                            </li>
                            <li>
                                <em>微信</em>
                                <span>sannianqiyue</span>
                            </li>
                            <li>
                                <em>QQ</em>
                                <span>409104540</span>
                            </li>
                        </ul>
                    </div>
                </modal>
            </div>
        </div>
    </div>
    <script src="../content/js/lib/vue/vue.min.js"></script>
    <script src="../content/static/js/jquery.min.js?v=2.1.4"></script>
    <script src="../content/static/js/bootstrap.min.js?v=3.3.5"></script>
    <script src="../content/static/js/plugins/iCheck/icheck.min.js"></script>
    <script src="../content/static/js/plugins/chosen/chosen.jquery.js"></script>
    <script src="../content/static/js/plugins/bootstrap-table/bootstrap-table.min.js"></script>
    <script src="../content/static/js/content.min.js?v=1.0.0"></script>
    <script src="../content/js/lib/calendar/calendar.js"></script>
    <script src="../content/js/lib/calendar/scrollbar.js"></script>
    <script src="../content/js/lib/vue/vue-modal.js"></script>
    <script src="../content/js/lib/vue/vue-pagination.js"></script>
    <script src="../content/js/common.js"></script>
    <script src="../content/js/lib/vue/select2.js"></script>
    <script type="text/javascript">
        $("#warehouse").select2({
            width: "220px"
        });
        $("#status").select2({
            width: "220px"
        });
        $("#approveStatus").select2({
            width: "220px"
        });
        var vmData = {
            approvalModal: {
                show: false,
                style: {
                    width: '560px',
                    height: "auto"
                },
                addClass: 'scroll-modal',
                func: {
                    type: Function
                },
                close: function () {
                    vm.approvalModal.show = false;
                }
            },
            relevanceModal: {
                show: false,
                style: {
                    width: '980px',
                    height: "auto"
                },
                addClass: 'scroll-modal',
                func: {
                    type: Function
                },
                close: function () {
                    vm.detailModal.show = false;
                }
            },
            borrowDetailModal: {
                show: false,
                style: {
                    width: '980px',
                    height: "auto"
                },
                addClass: 'scroll-modal',
                func: {
                    type: Function
                },
                close: function () {
                    vm.borrowDetailModal.show = false;
                }
            },
            detailModal: {
                show: false,
                style: {
                    width: '980px',
                    height: "auto"
                },
                addClass: 'scroll-modal',
                func: {
                    type: Function
                },
                close: function () {
                    vm.detailModal.show = false;
                }
            },
            addModal: {
                show: false,
                style: {
                    width: '680px',
                    height: "auto"
                },
                addClass: 'scroll-modal',
                func: {
                    type: Function
                },
                close: function () {
                    vm.addModal.show = false;
                }
            },
            productSelectModal: {
                show: false,
                style: {
                    width: '980px',
                    height: "auto"
                },
                addClass: 'scroll-modal',
                func: {
                    type: Function
                },
                close: function () {
                    vm.productSelectModal.show = false;
                }
            },
            modelTitle: "",
            customerList: [{
                    "Text": "普通客户",
                    "Value": "100%",
                },
                {
                    "Text": "一级客户",
                    "Value": "80%",
                },
                {
                    "Text": "二级客户",
                    "Value": "85%",
                },
                {
                    "Text": "三级客户",
                    "Value": "90%",
                },
                {
                    "Text": "四级客户",
                    "Value": "95%",
                }
            ],
            backStatusList: [{
                    "Text": "全部",
                    "Value": "553",
                },
                {
                    "Text": "未归还",
                    "Value": "360",
                }, {
                    "Text": "已归还",
                    "Value": "365",
                },
                {
                    "Text": "转销售",
                    "Value": "4105",
                }
            ],
            warehouseList: [{
                    "Text": "北京",
                    "Value": "553",
                },
                {
                    "Text": "上海",
                    "Value": "360",
                }, {
                    "Text": "大西洋大西洋大西洋大西洋大西洋大西洋大西洋",
                    "Value": "365",
                },
                {
                    "Text": "广州",
                    "Value": "4105",
                }, {
                    "Text": "北冰洋",
                    "Value": "510",
                },
                {
                    "Text": "深圳",
                    "Value": "3219",
                },
                {
                    "Text": "天津",
                    "Value": "99402",
                },
                {
                    "Text": "合肥",
                    "Value": "519",
                },
                {
                    "Text": "苏州",
                    "Value": "518",
                },
                {
                    "Text": "南京",
                    "Value": "517",
                },
                {
                    "Text": "无锡",
                    "Value": "525",
                },
                {
                    "Text": "大东北",
                    "Value": "528",
                },
                {
                    "Text": "大西北",
                    "Value": "533",
                },
                {
                    "Text": "非洲",
                    "Value": "538",
                },
                {
                    "Text": "欧洲",
                    "Value": "537",
                },
                {
                    "Text": "南美洲",
                    "Value": "536",
                }
            ],
            modelFlag: 0,
            selectProductItem: [],
            productListSelect: [{
                    "checked": false,
                    "Id": "1",
                    "productCode": "SP20150717002",
                    "productName": "三角阀",
                    "spec": "桶",
                    "prope": "通用型",
                    "stockCount": "12",
                    "price": "12",
                    "remark": "",
                    "img": "../content/static/img/no_pic.png"
                },
                {
                    "checked": false,
                    "Id": "2",
                    "productCode": "SP20150717002",
                    "productName": "劲霸皮革清洗剂",
                    "spec": "桶",
                    "prope": "5L",
                    "stockCount": "1",
                    "inventoryCount": "1",
                    "remark": "",
                    "barCode": "",
                    "img": "../content/static/img/no_pic.png"
                }, {
                    "checked": false,
                    "Id": "3",
                    "productCode": "SP20150717002",
                    "productName": "快卫内饰清洗剂",
                    "spec": "瓶",
                    "prope": "500ML",
                    "stockCount": "52",
                    "price": "52",
                    "remark": "",
                    "img": "../content/static/img/no_pic.png"
                }, {
                    "checked": false,
                    "Id": "4",
                    "productCode": "SP20150717002",
                    "productName": "漆面至尊镀晶大套装",
                    "spec": "套",
                    "prope": "",
                    "stockCount": "14",
                    "price": "15",
                    "remark": "",
                    "img": "../content/static/img/no_pic.png"
                }
            ],
            productChooseList: [],
            accountList: [{
                "Text": "中国银行",
                "Value": "1",
            }, {
                "Text": "建设银行",
                "Value": "2",
            }, {
                "Text": "农业银行",
                "Value": "3",
            }, {
                "Text": "工商银行",
                "Value": "4",
            }, {
                "Text": "现金",
                "Value": "5",
            }, ],
            productChooseList: [],
            typeList: [{
                "Text": "个体",
                "Value": "1",
            }, {
                "Text": "单位",
                "Value": "2",
            }, {
                "Text": "其他",
                "Value": "3",
            }],
            flag: false,
        };
        vmData = $.extend(vmData, baseData);
        var vmMothod = {
            init: function () {},
            approvalShow: function () {
                vm.approvalModal.show = true;
            },
            borrowDetailShow: function () {
                vm.borrowDetailModal.show = true;
            },
            detailShow: function (obj) {
                vm.detailModal.show = true;
                $("#backStatus").select2({
                    width: "160px"
                });
                $("#backStatus").val('').trigger('change'); //初始化
            },
            relevanceShow: function () {
                vm.relevanceModal.show = true;
            },
            addShow: function () {
                vm.addModal.show = true;
                $(".i-checks").iCheck({
                    checkboxClass: "icheckbox_square-green",
                    radioClass: "iradio_square-green",
                });
                $("#customer_status").select2({
                    width: "133px"
                });
                $("#customer_status").val('').trigger('change'); //初始化
                $("#customer_type").select2({
                    width: "190px"
                });
                $("#customer_type").val('').trigger('change'); //初始化
                $("#customer_level").select2({
                    width: "133px"
                });
                $("#customer_level").val('').trigger('change'); //初始化
                $("#supplier").select2({
                    width: "133px"
                });
                $("#supplier").val('').trigger('change'); //初始化
                $("#customer_type").on("select2:select", function () {
                    var data = $(this).val();
                    if (data == "2") {
                        vm.$set("flag", true);
                    } else {
                        vm.$set("flag", false);
                    }
                });
            },
            selectProduct: function () {
                vm.productSelectModal.show = true;
            },
            productChooseClick: function (e) {
                if (e.checked) {
                    vm.productChooseList.forEach(function (a, v) {
                        if (a.Id = v.Id)
                            vm.productChooseList.splice(v, 1);
                    });
                } else {
                    vm.productChooseList.push(e);
                }
            },
        };
        vmMothod = $.extend(vmMothod, baseCommonFunction);
        var vm = new Vue({
            el: '.content-container',
            data: vmData,
            methods: vmMothod
        });
        vm.init();
    </script>
</body>

</html>